
body,html{
  width: 100%;
  height: 100%;
}
*{
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  list-style: none;
  font-family: "Helvetica Neue", Helvetica, Arial, "PingFang SC", "Hiragino Sans GB", "Heiti SC", "Microsoft YaHei", "WenQuanYi Micro Hei", sans-serif;
  font-size: 14px;
  color: #333;
}
h1, h2, h3, h4, h5, h6{font-weight:normal;}
a{
  text-decoration: none;
}
.pic {
  >img {
    display: block;
    width: 100%;
  }
}
input, textarea {
  outline: none;
  border: none;
  background: transparent;
}
.el-form-item__label:before{
  content: ''!important;
}
textarea {
  resize: none;
  overflow: auto;
}
input::-webkit-outer-spin-button,input::-webkit-inner-spin-button{
  -webkit-appearance:textfield;
}
input[type="number"]{
  -moz-appearance:textfield;
}
.fl {
  float: left
}

.fr {
  float: right
}
.ellipse {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
@mixin bgm() {
  background-size: 100%;
  background-repeat: no-repeat;
  background-position: center center;
}
::-webkit-input-placeholder { color:#B2B2B2; }
::-moz-placeholder { color:#B2B2B2; } /* firefox 19+ */
:-ms-input-placeholder { color:#B2B2B2; } /* ie */
input:-moz-placeholder { color:#B2B2B2; }

.flex {display:flex;}
.inline-flex {display:inline-flex;}
.flex-center{justify-content: center;align-items: center;}
/*横向或纵向*/
.flex-row {flex-direction:row;}
.flex-col {flex-direction:column;}
.flex-row-reverse {flex-direction:row-reverse;}
.flex-col-reverse {flex-direction:column-reverse;}
.flex-wrap {flex-wrap:wrap;}
/*主轴对齐方式*/
.flex-justify-start {justify-content:flex-start;}
.flex-justify-end {justify-content:flex-end;}
.flex-justify-center {justify-content:center;}
.flex-justify-between {justify-content:space-between;}
.flex-justify-around {justify-content:space-around;}
/*侧轴对齐方式*/
.flex-align-start {align-items:flex-start;}
.flex-align-end {align-items:flex-end;}
.flex-align-center {align-items:center;}
.flex-align-baseline {align-items:baseline;}
.flex-align-stretch {align-items:stretch;}
/*主轴换行时行在侧轴的对齐方式，必须定义flex-wrap为换行*/
.flex-content-start {align-content:flex-start;}
.flex-content-end {align-content:flex-end;}
.flex-content-center {align-content:center;}
.flex-content-between {align-content:space-between;}
.flex-content-around {align-content:space-around;}
.flex-content-stretch {align-content:stretch;}
/*允许子元素收缩*/
.flex-child-grow {flex-grow: 1;}/*允许拉伸*/
.flex-child-shrink {flex-shrink: 1;}/*允许收缩*/
.flex-child-noshrink {flex-shrink: 0;}/*不允许收缩*/
.flex-child-average {flex:1;}/*平均分布，兼容旧版必须给宽度*/
.flex-child-first {order: 1;}/*排第一个*/
/*子元素在侧轴的对齐方式*/
.flex-child-align-start {align-self:flex-start;}
.flex-child-align-end {align-self:flex-end;}
.flex-child-align-center {align-self:center;}
.flex-child-align-baseline {align-self:baseline;}
.flex-child-align-stretch {align-self:stretch;}

.full-height{height:100%;}
.full-width{width:100%;}
.relative { position: relative; }
.absolute { position: absolute; }
.fixed { position: fixed; }
.clear { clear: both; }
.overflow-hide { overflow: hidden; }
.normal { font-weight: normal; }
.bold { font-weight: bold; }
.font-35 { font-size: 35px; }
.font-30 { font-size: 30px; }
.font-24 { font-size: 24px; }
.font-20 { font-size: 20px; }
.font-18 { font-size: 18px; }
.font-16 { font-size: 16px!important; }
.font-15 { font-size: 15px; }
.font-14 { font-size: 14px; }
.font-13 { font-size: 13px; }
.font-12 { font-size: 12px; }
.font-10 { font-size: 10px; }
.border-box{box-sizing: border-box;}
.border-top, .border-right, .border-bottom, .border-left { position: relative; border: 0; }
.border-top:before, .border-bottom:after { content: ""; position: absolute; -webkit-transform: scaleY(.5); transform: scaleY(.5); -webkit-transform-origin: 0 0; transform-origin: 0 0; }
.border-left:before, .border-right:after { content: ""; position: absolute; -webkit-transform: scaleX(.5); transform: scaleX(.5); -webkit-transform-origin: 0 0; transform-origin: 0 0; }
.border-top:before { top: 0; left: 0; right: 0; border-top: 1px solid #dfdfdf; }
.border-bottom:after { bottom: 0; left: 0; right: 0; border-bottom: 1px solid #dfdfdf; }
.border-left:before { top: 0; left: 0; bottom: 0; border-left: 1px solid #dfdfdf; }
.border-right:after { bottom: 0; top: 0; right: 0; border-right: 1px solid #dfdfdf; }
.margin { margin: 10px; }
.margin-top { margin-top: 10px; }
.margin-right { margin-right: 10px; }
.margin-bottom { margin-bottom: 10px; }
.margin-left { margin-left: 10px; }
.padding { padding: 10px; }
.p10-0{ padding: 10px 0}
.padding-top { padding-top: 10px; }
.padding-right { padding-right: 10px; }
.padding-bottom { padding-bottom: 10px; }
.padding-left { padding-left: 10px; }
.text-center { text-align: center; }
.pointer{cursor: pointer;}
.ellipsis { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nowrap { word-wrap: normal; white-space: nowrap; }
.lines-1{text-overflow:ellipsis;overflow:hidden;line-height: 1.2;white-space: nowrap;}
.lines-2{text-overflow:ellipsis;-webkit-line-clamp:2;display: -webkit-box;overflow:hidden;-webkit-box-orient: vertical;line-height: 1.2;white-space: nowrap;}
.lines-4{text-overflow:ellipsis;-webkit-line-clamp:4;display: -webkit-box;overflow:hidden;-webkit-box-orient: vertical;line-height: 1.2;white-space: nowrap;}

/*颜色*/
.orange, a.orange { color: #ff6700; }
.orange-bg { background-color: #ff6700; }
.grey, a.grey { color: #505050; }
.grey-bg { background-color: #505050; }
.grey-6, a.grey-6 { color: #6b6b6b; }
.grey-6-bg { background-color: #6b6b6b; }
.grey-9, a.grey-9 { color: #9c9c9c; }
.grey-9-bg { background-color: #9c9c9c; }
.grey-d, a.grey-d { color: #dfdfdf; }
.grey-d-bg { background-color: #dfdfdf; }
.grey-e, a.grey-e { color: #efefef; }
.grey-e-bg { background-color: #efefef; }
.grey-f, a.grey-f { color: #f5f5f5; }
.grey-f-bg { background-color: #f5f5f5; }
.black, a.black { color: #333; }
.black-bg { background-color: #333; }
.white, a.white { color: #fff; }
.white-bg { background-color: #fff; }
.red, a.red { color: #FF3B3B; }
.red-bg { background-color: #FF3B3B; }
.light-red, a.light-red { color: #ff5050; }
.light-red-bg { background-color: #ff5050; }
.orange-red, a.orange-red { color: #ff4e00; }
.orange-red-bg { background-color: #ff4e00; }
.yellow, a.yellow { color: #fbcb30; }
.yellow-bg { background-color: #fbcb30; }
.orange-yellow, a.orange-yellow { color: #fd9712; }
.orange-yellow-bg { background-color: #fd9712; }
.green, a.green { color: #5dc800; }
.green-bg { background-color: #5dc800; }
.light-green, a.light-green { color: #8fd14c; }
.light-green-bg { background-color: #8fd14c; }
.blue, a.blue { color: #3462FF; }
.blue-bg { background-color: #3462FF!important; }
.light-blue, a.light-blue { color: #7597dc; }
.light-blue-bg { background-color: #7597dc; }
.pink, a.pink { color: #fb5c9b; }
.pink-bg { background-color: #fb5c9b !important;}
.purple, a.purple { color: #a776d9; }
.purple-bg { background-color: #a776d9; }
.light-purple, a.light-purple { color: #b394f3; }
.light-purple-bg { background-color: #b394f3; }